window.addEventListener('load', function () {
  new Swiper('.swiper', {
    loop: true, // 循环模式选项 
    // 如果需要分页器
    pagination: {
      el: '.swiper-pagination',
    },
    // 如果需要前进后退按钮
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },
  })

 // 换页时的js样式
let changepages=document.querySelectorAll('header .nav li');
// console.log( changepages.length);
changepages.forEach(function(v){
  v.addEventListener('mouseover',function(){
    for (let j = 0; j < changepages.length; j++) {
      changepages[j].classList.remove('active');
    }
    v.classList.add('active');
  })
  v.addEventListener('mouseout',function(){
    v.classList.remove('active');
    changepages[0].classList.add('active');
})
})
/*
// 侧边栏的js代码
let sTop=document.querySelector("#relation .top")
window.addEventListener('scroll',function(){
  let asideList=document.documentElement.scrollTop;
  if(asideList>=600){
    relation.style.display='block';
  }else{
    relation.style.display='none';
  }
})
let timeid=null;
sTop.addEventListener('click',function(){
timeid=window.setInterval(function(){
  let asideList=document.documentElement.scrollTop;
document.documentElement.scrollTop=asideList-50;
console.log(asideList);
if(asideList<=30){
  window.clearInterval(timeid);
}
},10)
}) */

  let arr = [
    {
      imgUrl: "./imgs/service01.svg",
      // imgUrl:" <img src='./imgs/service01.svg' alt=''>",
      title: "API私有化服务",
      desc: '可部署本地&专有云的Web API'
    },
    {
      imgUrl: "./imgs/service02.svg",
      title: "源码云监测",
      desc: '实时代码托管、威胁情报监控'
    },
    {
      imgUrl: "./imgs/service03.svg",
      title: "源码有赢",
      desc: '一站式营销活动服务平台'
    },
    {
      imgUrl: "./imgs/service04.svg",
      title: " YuanMa API",
      desc: 'API开发者协作平台'
    }
  ]
  let subHtml = '';
  arr.forEach(function (v) {
    // console.log(v);
    subHtml += `           
        <li>
        <img src="${v.imgUrl}" alt="">
        <div>
            <h3 class="fz18 fc18"> ${v.title}</h3>
            <p class="fc66">${v.desc}</p>
            <a href="#" class="fcef">去搜索</a>
        </div>
    </li>
    `
  })
  // serviceList=document.getElementById('serviceList')
  serviceList.innerHTML = subHtml;

  let apiList = [
    {
      imgUrl: './imgs/api01.svg',
      title: '生活服务'
    },
    {
      imgUrl: './imgs/api02.svg',
      title: '金融科技'
    },
    {
      imgUrl: './imgs/api03.svg',
      title: '交通地理'
    },
    {
      imgUrl: './imgs/api04.svg',
      title: '充值缴费'
    },
    {
      imgUrl: './imgs/api05.svg',
      title: '数据智能'
    },
    {
      imgUrl: './imgs/api06.svg',
      title: '企业工商'
    },
    {
      imgUrl: './imgs/api07.svg',
      title: '应用开发'
    },
    {
      imgUrl: './imgs/api08.svg',
      title: '电子商务'
    },
    {
      imgUrl: './imgs/api09.svg',
      title: '吃喝玩乐'
    },
    {
      imgUrl: './imgs/api10.svg',
      title: '文娱视频'
    },

  ]
  let apiHtml = '';
  apiList.forEach(function (v) {
    apiHtml += `
  <li>
  <img src="${v.imgUrl}" alt="">
  <h4>${v.title}</h4>
</li>
`
  })
  api.innerHTML = apiHtml;

  // 获取元素
  let apilist = getEleAll("#api li");
  // console.log(apilist);
  apilist.forEach(function (v) {
    // console.log(v);
    v.addEventListener('mouseover', function () {
      this.style.backgroundColor = '#2f7ee9';
      this.lastElementChild.style.color = '#fff';

      // let imgUrl=this.firstElementChild.src;
      //  oldUrl=imgUrl;
      // let inDex=imgUrl.lastIndexOf('/');
      // // console.log(imgUrl);
      // let newUrl=imgUrl.substring(inDex+1);
      // this.firstElementChild.src=`./imgs/${newUrl.split('.')[0]}-c.svg`
      // console.log(newUrl);
      let imgUrl = this.firstElementChild.src;
      oldUrl = imgUrl;
      let cutUrl = imgUrl.substring(0, imgUrl.lastIndexOf('.'));
      this.firstElementChild.src = `${cutUrl}-c.svg`


    })
    v.addEventListener('mouseout', function () {
      this.style.backgroundColor = '';
      this.lastElementChild.style.color = '';
      this.firstElementChild.src = oldUrl;


    })
  })
  // 银行的轮播图
  let magnate = document.querySelectorAll('#magnate>div');
  console.log(magnate[0]);
  let index = 0;
  magnate[index].style.display='block';
window.setInterval(function () {
    magnate[index].style.display='none';
    index++
if(index==magnate.length){
  index=0;
}
magnate[index].style.display='block';

  }, 2000)

 



})